import { useEffect, useState } from 'react'
import axios from 'axios'
import './App.css'

function App() {
  //扫描二维码后出现的内容
  let [content,setContent] = useState<string>("")
  //后端返回base64格式的url地址
  let [url,setUrl] = useState<string>("")

  //生成二维码
  const createQrCode = () => {
    axios.get("http://localhost:5002/qrCode/createQrCode/"+content).then((res) => {
      setUrl(res.data)
      setContent("")
    })
  }

  return (
    <>
      <div className="main_content">
        <div className="main_content_1">二维码的内容：</div>
        <input type="text" value={content} onChange={e=>{
          setContent(e.target.value)
        }} />
      </div>
      <button onClick={createQrCode} className="main_create_qr_code">生成二维码</button>
      <img src={url} alt="" />
    </>
  )
}

export default App
